<ion-view view-title="SWORKIT">
    <ion-content class="app-galy-back no-margin no-padding">
      <div class="position-relative">
        <div class="row no-padding-horizontal" ng-repeat="p in playlists" >
            <div class="col col-50 position-relative" ng-repeat="x in p" ng-click="translatePage(x.id)">
                <img ng-src="{{x.atthment}}" width="100%" style="height: auto;">
                <div class="img-title font-white">{{x.name}}</div>
            </div>
        </div>
            <div class="circle-btn" ng-click="showPlay()">
                <div class="btn-center font-white text-center" style="line-height:35px">快速<br/>健身</div>
            </div>
       </div>
        
        <div class="app-galy-back" style="padding:10px 20px">
            <div class="font-center font-white" style="padding:10px 20px;border:2px solid #434343">
                <i class="ion-plus"></i> 订制锻炼计划
            </div>
        </div>
    </ion-content>
</ion-view>
<style>
    .col-50:first-child {
        padding: 5px 3px 0px 0px;
    }

    .col-50:last-child {
        padding: 5px 0px 0px 3px;
    }

    .circle-btn {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        background: rgba(255, 255, 255, .6);
        position: absolute;
        left:50%;
        top:50%;
        margin-left:-50px;
        margin-top:-50px;
        z-index:11;
    }

    .btn-center {
        width: 80px;
        height: 80px;
        background: orange;
        border-radius: 50%;
        border:2px solid #fff;
        position: absolute;
        left: 10px;
        top: 10px;
    }

    .img-title {
        display: box;
        display: -webkit-box;
        display: -moz-box;
        width: 100%;
        height: 100%;
        vertical-align: middle;
        position: absolute;
        left: 0;
        top: 0;
        background: rgba(0, 0, 0, .3);
        z-index: 10;
        -webkit-box-pack: center;
        -moz-box-pack: center;
        -webkit-box-align: center;
        -moz-box-align: center;
    }

</style>